{include file="public/head" title="维修费用" keywords="维修费用" description="维修费用" /}
<style>
    .toauth span p{
        line-height: 16px;
        height: 16px;
    }
</style>
<div id="offCanvasWrapper" class="mui-off-canvas-wrap mui-draggable">
    <!-- 菜单容器 -->

    <div class="mui-inner-wrap">
        <div id="offCanvasContentScroll" class="mui-content mui-scroll-wrapper" style="background-color: #fff;">
            <div class="mui-scroll">
                <header class="tx_head">
                    <p>
                        <a href="{:url('index')}" class="header_p1"><span class="mui-icon mui-icon-arrowleft"></span></a>
                    <h5 >维修费用</h5>
                    </p>
                </header>
                <main class="wdzh_main">
                    <section class="">
                    <div>
                        <ul>

                            <li class="toauth"><span style="font-size: 16px;">维修项目:{$order.goods_name}</span></li>
                            <li class="toauth"><span style="font-size: 16px;color: red;float: left">*</span><span style="font-size: 16px;margin-left: -0.15rem">总收费:</span><input type="number" step="0.01" min="0.01" value="{$order_j.total_price}" name="total_price" style="font-size: 14px;width: 71%;border: none" placeholder="请输入总服务费用"></li>
                            <li class="toauth"><span style="font-size: 16px;float: left">材料费:</span><input type="number" step="0.01" name="cailiao_price" value="{$order_j.cailiao_price}"  style="font-size: 14px;width: 71%;border: none" placeholder="请输入给用户报的材料费用(可包含人工费)"></li>
                            <li class="toauth"><span style="font-size: 16px;float: left">配件名称:</span><input type="text" name="cailiao_name" value="{$order_j.cailiao_name}"style="font-size: 14px;width: 71%;border: none" placeholder="请输入配件名称"></li>
                            <li class="toauth"><span style="font-size: 16px;float: left">配件成本费:</span><input type="number" step="0.01"value="{$order_j.chenben_price}" name="chenben_price" style="font-size: 14px;width: 71%;border: none" placeholder="请输入配件成本费"></li>
                            <li class="toauth"><span style="font-size: 16px;float: left">师傅备注:</span><input type="text" name="remake" value="{$order_j.remake}"style="font-size: 14px;width: 71%;border: none" placeholder="请输入师傅备注内容"></li>
                            <li style="border-bottom: 1px solid #eee;">
                                <span style="font-size: 16px;margin: 0 2px 0 16px;float: left;">配件图片:</span>
                                <p style="display: block;float: left;height: 4.5rem">
                                    <?php
                                    $imgs_0 = '';
                                    $imgs_1 = '';
                                    $imgs_2 = '';
                                    $imgs =explode(',',$order_j['imgs']);
                                    if(isset($imgs[0]) && !empty($imgs[0]))$imgs_0=$imgs[0];
                                    if(isset($imgs[1]) && !empty($imgs[1]))$imgs_1=$imgs[1];
                                    if(isset($imgs[2]) && !empty($imgs[2]))$imgs_2=$imgs[2];
                                ?>
                                    <input type="hidden" name="imgs_0">
                                    <a  href="javascript:upimg(0);">
                                    <img {if !empty($imgs_0)}src="{$imgs_0}" {else /} src="/static/wap/20181201173806.png " {/if}  id="img_0" style="width: 5rem; height: 5rem;border: 1px solid #f2f2f2;" />
                                    </a>
                                </p>
                                <p style="display: block;float: left;height: 4.5rem">
                                    <input type="hidden" name="imgs_1">
                                    <a  href="javascript:upimg(1);">
                                        <img {if !empty($imgs_1)}src="{$imgs_1}" {else /} src="/static/wap/20181201173806.png " {/if}  id="img_1" style="width: 5rem; height: 5rem;border: 1px solid #f2f2f2;" />
                                    </a>
                                </p>
                                <p style="display: block;float: left;height: 4.5rem">
                                    <input type="hidden" name="imgs_2">
                                    <a  href="javascript:upimg(2);">
                                        <img {if !empty($imgs_2)}src="{$imgs_2}" {else /} src="/static/wap/20181201173806.png " {/if} id="img_2" style="width: 5rem; height: 5rem;border: 1px solid #f2f2f2;" />
                                    </a>
                                </p>
                                <p style="margin: 0 2px 0 18px;display: block;clear: both;height: 4rem;">
                                    包含材料的需上传材料图片,有跟换下来旧材<br />料的需上传更换下来的新旧材料图片
                                </p>
                            </li>
                            <li >
                                <span style="color: red;float: left; font-size: 16px;margin-left: 1rem">费用结算须知:</span>
                                <span style="display: block;clear: both; margin-left: 2rem; font-size: 16px;">
                                    1，请师傅按实际费用填写。<br />
                                    2，填写各项费用过程中，如发现欺诈，虚假等行为一经发现从严处理。
                                </span>
                                <input type="hidden" name="orderid" value="{$id}">
                            </li>

                        </ul>
                    </div>

                    </section>
                </main>
                <br>
                <br>
                <br>
                <br>
                <br>
                <br>
                <br>
                <br>
                <br>
                <br>
                <br>
                <br>
                <br>
            </div>

        </div>
        <div class="mui-off-canvas-backdrop">

        </div>

    </div>

</div>
<nav style="border-top:#fff">
            <span style=" display: block;font-size: 1.2rem; float: left;background: #f2f2f2;color: #fff;width: 50%;height: 3rem; line-height: 3rem;text-align: center">
                <a href="javascript:history.go(-1);" style="color: #000">返回</a>
            </span>
    <span style=" display: block;font-size: 1.2rem; float: left;background: #00bfb0;color: #fff;width: 50%;height: 3rem; line-height: 3rem;text-align: center">
                <a href="javascript:tijiao();" style="color: #fff">提交</a>
            </span>
</nav>
{include file="public/footer"}
</body>
<script>
    mui('body').on('tap','a',function(){
        var str = this;
        // 强制转换为字符串
        str = String(str);

    });
    function upimg(i) {

        $.ajax({
            url: "{:url('Account/test')}",//请求地址
            type: 'post',//post请求
            dataType: 'json',
            contentType: "application/x-www-form-urlencoded; charset=utf-8",
            data: {
                'url': location.href.split('#')[0]//将第一个#号前的地址传递
            },
            success: function (data) {
                wx.config({
//                    debug: true,
                    appId: data.data.appId,
                    timestamp: data.data.timestamp,
                    nonceStr: data.data.nonceStr,
                    signature: data.data.signature,
                    jsApiList: ['uploadImage', 'chooseImage', 'downloadImage','previewImage']
                });
                wx.ready(function () {
                    wx.chooseImage({
                        count: 1, // 默认9
                        sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
                        sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
                        success: function (res) {
                            var localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
                            $('#img_'+i).attr('src', localIds[0]);
                            // 上传照片
                            wx.uploadImage({
                                localId: '' + localIds[0],
                                isShowProgressTips: 1,
                                success: function (res) {
                                    serverId = res.serverId;
                                    $.ajax({
                                        url:'{:url("wximg")}',
                                        type: "post",
                                        dataType: "json",
                                        data: {
                                            localData: serverId,
                                        },
                                        success: function (data) {
//                                            $('#img_'+i).attr('src',data.src);
//                                            alert(i)
                                            $('input[name="imgs_'+i+'"]').val(data.src);
                                        },
                                        error: function (XMLHttpRequest, textStatus, errorThrown) {
                                            alert(errorThrown);
                                        },
                                    });
                                }
                            });
                        }
                    });
                });


            }
        })
    }
    function tijiao() {
        var data = {
            total_price: $('input[name="total_price"]').val(),
            cailiao_name:$('input[name="cailiao_name"]').val(),
            cailiao_price: $('input[name="cailiao_price"]').val(),
            chenben_price:$('input[name="chenben_price"]').val(),
            orderid:$('input[name="orderid"]').val(),
            remake:$('input[name="remake"]').val(),
            imgs:$('input[name="imgs_0"]').val() +','+$('input[name="imgs_1"]').val()+','+$('input[name="imgs_2"]').val(),

        }
        var re = /^[0-9]+.?[0-9]*$/;
        if (!re.test(data.total_price)){
            layer.msg('请填写正确的金额',{icon:2,time:1000});
            return false;
        }
       $.ajax({
           type:"post",
           url:"{:url('addweixiou')}",
           data:data,
           dataType:"json",
           success:function (res) {
               if (res.code == 1){
                   layer.msg(res.msg,{icon:1,time:1000},function () {
                       window.location.href = res.url;
                   })

               }else {
                   layer.msg(res.msg,{icon:2,time:1000})
               }
           }
       })
    }
</script>
</html>